<ul class="button">
    <li><a href="javascript:void(0);" class="add">添加</a></li>
</ul>

<table class="records">
    <thead>
        <tr>
            <th>ID</th>
            <th>图片</th>
            <th>操作</th>
        </tr>
    </thead>
    <tfoot><tr><td colspan="3"></td></tr></tfoot>
    <tbody><tr><td colspan="3">loading...</td></tr></tbody>
</table>

<script id="form-template" type="text/x-jquery-tmpl">
    <form action="/backend/${action}" method="post" enctype="multipart/form-data" target="upload-iframe">
	<input type="hidden" name="path" value="banner"/>
	<input type="hidden" name="image_name" value="${image_name}"/>
	<input type="file" name="image"/>
	<input type="submit" value="${submit_value}" name="submit"/>
    </form>
    <iframe name="upload-iframe" style="width:0;height:0;display: none;"></iframe>
</script>

<script id="list-template" type="text/x-jquery-tmpl">
    <tr>
	<td><input type="checkbox" name="id[]" value="${id}"/></td>
	<td>${image}</td>
	<td>
	    <a href="javascript:void(0);" class="replace">替换</a>
	    <a href="javascript:void(0);" class="delete">删除</a>
	</td>
    </tr>
</script>

<script type="text/javascript">
    $(function(){
	var dialog;
	window.uploadCallback = function(status,msg,data){
	    switch(status){
		case 'XT001':
		    if(msg!=''){
			Z.tip(msg,2);
		    }
		    dialog.close();
		    ajaxFill.reload();
		    break;
		case 'XT002':
		    Z.alert(msg||'操作失败');
		    break;
		case 'XT003':
		    Z.alert('您不具备此操作权限');
		    break;
		case 'XT004':
		    Z.alert('请先登录');
		    break;
		default:
		    Z.alert('未知错误!');
                  
	    };
	};
	
	var ajaxFill = new Z.AjaxFill({
	    url: Z.url('/backend/banner/records'),
	    templates: {
		list: $('#list-template').html(),
		none: '<tr><td colspan="3">none</div></tr>'
	    },
	    containers: {
		list: $('table.records tbody'),
		pageLinks: $('table.records tfoot td')
	    },
	    data: {
		pageSize: 20,
		page: 1
	    }
	});
	
	ajaxFill.request();
	
	$('a.add').click(function(){
	    var data = {action: 'banner/insert',  submit_value: '提交'};
	    
	    dialog = Z.alert({
		content: $('#form-template').tmpl(data)
	    });
	    return false;
	});
	
	$('a.replace').live('click',function(){
	    var data = {action: 'photo/replace',  submit_value: '替换',image_name:$(this).parent().prev().html()};
	    dialog = Z.alert({
		content: $('#form-template').tmpl(data)
	    });
	    return false;
	});
	
	$('a.delete').live('click',function(){
	    var id = Z.parseInt($(this).parent().siblings().first().find(':checkbox').val());
	    Z.confirm({
		content: '确定删除？',
		onConfirm: function(){
		    Z.ajax({
			url: Z.url('/backend/banner/delete/'+id),
			success: function(){
			    ajaxFill.reload();
			}
		    });
		}
	    });
	    return false;
	});
    });
</script>